<template>
	<view>
		<view class="audioBox" v-for="(item,index) in audioData" :key="index">
			<text class="audioStatus">{{item.audioStatus}}</text>
			<image class="biao" src="../../../static/task/bianhao3.png"></image>
			<text class="year">{{item.month}}&nbsp&nbsp{{item.time}}</text>
			<text class="reason">{{item.reason}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				audioData:[{
					audioStatus:'审核通过',
					month:'2020-04-29',
					time:'9:30',
					reason:''
				},
				{
					audioStatus:'审核未通过',
					month:'2020-04-29',
					time:'9:30',
					reason:'请将任务口令放至步骤中说明'
				},
				{
					audioStatus:'审核未通过',
					month:'2020-04-29',
					time:'9:30',
					reason:'请上传口令'
				}]
			};
		}
	}
</script>

<style lang="scss">
      page{
		  background-color: #F1F1F1;
		  }
		  .audioBox{
			  width:710rpx;
			  height:130rpx;
			  background:rgba(255,255,255,1);
			  border-radius:10rpx;
			  margin-top: 10rpx;
			  margin-left: 20rpx;
			  position: relative;
		  }
		  .audioStatus{
			  font-size:28rpx;
			  font-family:PingFang SC;
			  font-weight:400;
			  color:rgba(51,51,51,1);
			  position: absolute;
			  top: 25rpx;
			  left: 21rpx;
		  }
		  .biao{
			  width: 23rpx;
			  height: 23rpx;
			  position: absolute;
			  top: 86rpx;
			  left: 21rpx;
		  }
		  .year{
			  font-size:24rpx;
			  font-family:PingFang SC;
			  font-weight:400;
			  color:rgba(142,142,142,1);
			  position: absolute;
			  left: 54rpx;
			  top: 79rpx;
		  }
		  .reason{
			  font-size:24rpx;
			  font-family:PingFang SC;
			  font-weight:400;
			  color:rgba(142,142,142,1);
			  position: absolute;
			  top: 46rpx;
			  right: 23rpx;
		  }
</style>
